<script>
import axios from "axios"

const http =axios.create({
  baseURL : 'http://localhost:8888/',
  timeout : 15000,
  headers: {'Content-Type':'application/x-www-form-urlencoded;charset=UTF-8'}
})

export default {
  name: "ProductSavePage",
  data(){
    return {
      product: {
        name :null,
        brand: null,
        price: null,
        discount: null,
        stock: null
      }
    }
  },
  methods:{
    handleSubmit(){
      this.$confirm('确定要提交吗？', '提示',{
        confirmButtonText: '确定',
        cancelButtonText : '取消'
      }).then(() => {
        //console.log(this.product)
        http.post('/product/save',this.product)
            .then((result) => {
              if(result.data.code == "1"){
                this.$notify.success(result.data.message)
              }else if(result.data.message == "-1"){
                this.$notify.error(result.data.message)
              }
            })
            .catch((error) => {
              this.$notify.error('服务器请求失败，请稍后再试')
            })
      }).catch(() =>{})

    }
  }

}
</script>

<template>
  <div>
    <el-card style="width: 800px; margin: 20px auto">
      <div slot="header">
        <span>新增商品</span>
      </div>
      <div>
        <el-form>
          <el-form-item label="商品名称">
            <el-input v-model="product.name" placeholder="商品名称"/>
          </el-form-item>
          <el-form-item label="商品品牌">
            <el-input v-model="product.brand" placeholder="商品品牌"/>
          </el-form-item>
          <el-form-item label="商品价格">
            <el-input v-model="product.price" placeholder="商品价格"/>
          </el-form-item>
          <el-form-item label="商品折扣">
            <el-input v-model="product.discount" placeholder="商品折扣"/>
          </el-form-item>
          <el-form-item label="商品库存">
            <el-input v-model="product.stock" placeholder="商品库存"/>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click = "handleSubmit">提交</el-button>
            <el-button>重置</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-card>
  </div>
</template>

<style scoped>

</style>